<template>
  <!-- 引用   -->
  <Header />
  <Menu/>
  <el-row>
    <el-col :span="6"></el-col>
    <el-col :span="12">
      <div class="survey-bat-item-wrapper">
        <SurveyShowItem v-for="item in  surveysContent"
                        :publisher="item.restaurantId"
                        :title="item.surveyTitle"
                        :survey-id="item.surveyId"/>
      </div>
    </el-col>
    <el-col :span="6"></el-col>
  </el-row>
  <el-pagination
      v-show="total>0"
      :total="total"
      @change="handlePageSelectChange"/>
<Footer/>
  </template>


<script setup>
  import Header from "../../components/Head.vue";
  import Menu from "@/components/Menu.vue";
  import Footer from "@/components/Footer.vue";
  import {queryAllReleaseSurveys} from "../../web-api/main/survey.js";
  import SurveyShowItem from "../../components/SurveyShowItem.vue";

  let surveysContent = ref([])
  let total = ref(0)
  let queryParams = reactive({
    pageSize: 30,
    pageNum: 1
  })

  const handlePageSelectChange = (newPageNum, newPageSize)=>{
    console.log(newPageNum, newPageSize)
    queryParams.pageSize = newPageSize;
    queryParams.pageNum = newPageNum;
    requestAllSatisfiedSurvey();
  }

  const requestAllSatisfiedSurvey = ()=>{
    queryAllReleaseSurveys(queryParams).then(r=>{
      surveysContent.value = r.rows
      total.value = parseInt(r.total)
    })
  }
  onBeforeMount(()=>{
    document.body.style.backgroundImage = 'none';
    requestAllSatisfiedSurvey();
  })
</script>



<style scoped>

</style>